ajajform_htmltemplates.select_or_upload_image_id={
    htmltemplate: 	'<div class="af-label"></div>'+
					'<div class="af-button">'+            
                        '<div class="button-emul upload active">'+
                            '<div class=label></div>'+
                            '<input class="upload_button errored" type="file" name="img_file">'+
							'<div class="cl"></div>'+
                        '</div>'+            
                        '<div class="button-emul status" style="display: none;">'+
                            '<div class=label>0%</div>'+
                        '</div>'+
                    '</div>'+
					'<div class="images"><div class="wrap"></div>'

};
(function( $, undefined ) {

$.widget("ui.ajajform_select_or_upload_image_id",$.ui.ajajform_widget, {
      
	options: {
		cssclass: "afw-select_or_upload_image_id",
		label: "",
		value:"",
		click:null,
		success:null
	},
	_create: function() {
		this.genericCreate();
		this.refreshLabel();
		this.refreshImages();
		this.refreshUpload();
        this.refreshClick();
		this.refreshClose();
	},
	mkPreview: function(url) {
		var t=this;
		if (!this.options.preview) return url;
		return url.replace(/(\.\w+)$/,function(p,p1) { return "-preview"+t.options.preview+p1});
	},
    refreshImages: function() {
        var t = this;
		var i=$(".images .wrap",t.element);
		var images = t.options.images;
		var cheked;
		if (images.length) images.forEach(function(e){
			cheked = (e.id==t.options.value) ? "checked":"";
			$("<div class='item "+cheked+"' data-id='"+e.id+"'><img src='"+t.mkPreview(e.url)+"'><div class='buttons'><div class='cancel'></div><div class='barrette'></div></div>").appendTo(i);                        
		});
		if (t.options.success) t.options.success(t.options.name,t.options.value);
	},
	refreshUpload: function() {
		var t = this;                    
		var formData = t.options.params;
		formData.name = t.options.name;
		
		var widget = t.element;
		var status_label = $('.status .label', widget);

		var on_error = function (e, data, ex) {
			if (ex) console.log(ex);
			status_label.text('ошибка');            
			setTimeout(function(){
				$('.status', widget).hide();
				$('.upload', widget).show();
			}, 5000);
		}
		$('.button-emul.upload', widget).fileupload({
			url: t.options.url,
			formData: formData,
			dataType: 'json',
			done: function (e, data) {
				$('.revert', widget).show();
				$('.af-error', widget).html("");
				console.log('done');
				status_label.text('готово');            
				setTimeout(function(){
						$('.status', widget).hide();
						$('.upload', widget).show();
					}, 1000);
				t.options.up_success(data.result,t);
			},
			error: on_error,
			progressall: function (e, data) {
				var status = parseInt(data.loaded / data.total * 100, 10);
				if (status > 95) status = 95;
				status_label.text(status + '%');
			},
			start: function (e, data) {
				status_label.text('0%');
				$('.upload', widget).hide();
				$('.status', widget).show();
			},
		}).prop('disabled', !$.support.fileInput).parent().addClass($.support.fileInput ? undefined : 'disabled');
		
		//$('.revert', widget).click(function(){
		//	t.options.up_success(t.options.rparams);
		//	$(this).hide();
		//}); 
	},
	refreshClick: function() {
		var t = this;
		var i=$(".images",t.element);
			$('.item',i).bind("click",function(){
					$('.item.checked').removeClass('checked');
					$(this).addClass('checked');
					t.options.value = $(this).attr('data-id');
					console.log('refreshClick');
					if (t.options.click) {
						var img;
						for (var i=0;i<t.options.images.length;i++) if (t.options.images[i].id==t.options.value) img=t.options.images[i];
						t.options.click(t.options.name,t.options.value,img);
					}
			});
	},
	refreshClose: function() {
		var t = this;
		var i=$(".images",t.element);
			$('.item .cancel',i).bind("click",function(){
					if($(this).parent().parent().hasClass('checked')){
						$(this).parent().parent().removeClass('checked');
						t.options.value = "";
					}
					if (t.options.close) {
						t.options.close(t.options.name,$(this).parent().parent().attr('data-id'));
					}
				return false;
			});
	},
	postvalue: function(r) {
		r[this.options.name]=this.options.value;
	}
});

})( jQuery );
